.vehicle-statistics-container {
  width: 100%;
  height: 100%;
  //   background-color: rgba(250, 248, 255);
  // 头部
  .vehicle-statistic-header {
    display: flex;
    justify-content: space-around;
    height: 300px;
    // 左侧
    .vehicle-statistic-header-left {
      width: 65%;
      height: 96%;
      .left-top {
        height: 40%;
        display: flex;
        justify-content: space-between;
        box-sizing: border-box;
        text-align: center;

        // 车辆总数
        .vehicle-fleet {
          width: 28%;
          display: flex;
          flex-direction: column;
          justify-content: center;
          align-items: center;
          box-sizing: border-box;
          border: 1px solid #ccc;
          border-radius: 5px;

          .vehicle-fleet-icon {
            font-size: 20px;
          }

          .vehicle-fleet-num {
            font-size: 35px;
            font-weight: 700;
          }

          .vehicle-fleet-font {
            font-size: 12px;
            color: #ccc;
          }
        }
        // 数据细化
        .vehicle-data-refinement {
          width: 70%;
          border: 1px solid #ccc;
          border-radius: 5px;
          .total-all-vehicle {
            height: 100%;
            display: flex;
            justify-content: space-around;
            align-items: center;

            .total-all-vehicle-item {
              .total-font {
                font-size: 12px;
                color: #ccc;
              }

              .total-num {
                font-size: 35px;
                font-weight: 700;
              }

              .right-one {
                margin-top: 15px;
              }
            }
          }
        }
      }
      // 车辆图表
      .left-bottom {
        margin-top: 20px;
        flex: 1;
        background-color: #fff;

        .left-bottom-echarts {
          width: 100%;
          height: 152px;
          display: flex;
          justify-content: space-around;
          box-sizing: border-box;
          border: 1px solid #ccc;
          border-radius: 5px;

          .vehicleProportionOption {
            position: relative;
            display: flex;
            flex-direction: column;

            p {
              position: absolute;
              top: 86%;
              left: 37%;
              font-size: 10px;
              color: #ccc;
            }
          }

          .vehicleTypeOption {
            position: relative;
            display: flex;
            flex-direction: column;

            p {
              position: absolute;
              top: 86%;
              left: 12%;
              font-size: 10px;
              color: #ccc;
            }
          }

          .vehicleGearboxOptions{
            position: relative;
            display: flex;
            flex-direction: column;

            p {
              position: absolute;
              top: 86%;
              left: 15%;
              font-size: 10px;
              color: #ccc;
            }
          }

          .bottom-echart {
            width: 230px;
            height: 150px !important;
            display: inline-block;
          }
        }
      }
    }
    // 右侧
    .vehicle-statistic-header-right {
      width: 33%;
      height: 96%;
      padding: 10px;
      box-sizing: border-box;
      border: 1px solid #ccc;
      border-radius: 5px;
      background-color: #fff;

      // 待年检车辆
      .wait-annual-inspection-vehicle {
        height: 30%;
        .wait-annual-inspection-vehicle-title {
          display: flex;
          justify-content: space-between;
          span {
            display: inline-block;
          }
        }
        .wait-annual-inspection-vehicle-content {
          width: 100%;
          display: flex;
          justify-content: space-around;
          padding: 15px;
          margin-top: 10px;
          border-radius: 5px;
          background-color: #ccc;

          .vehicle-base-message {
            width: 60%;
            font-size: 12px;
            max-height: 30px;
            overflow: hidden;
          }

          .license-plate {
            display: inline-block;
            color: red;
            font-size: 16px;
            font-weight: 500;
          }
        }
      }
      // 待保养车辆
      .wait-upkeep-vehicle {
        height: 30%;
        margin-top: 15px;
        .wait-upkeep-vehicle-title {
          display: flex;
          justify-content: space-between;
          span {
            display: inline-block;
          }
        }
        .wait-upkeep-vehicle-content {
          width: 100%;
          display: flex;
          justify-content: space-around;
          padding: 10px;
          margin-top: 10px;
          border-radius: 5px;
          background-color: #ccc;

          .vehicle-base-message {
            width: 60%;
            font-size: 12px;
            max-height: 30px;
            overflow: hidden;
          }

          .license-plate {
            display: inline-block;
            color: red;
            font-size: 16px;
            font-weight: 500;
          }
        }
      }
      // 异地停靠
      .off-site-call-vehicle {
        height: 30%;
        margin-top: 10px;
        .off-site-call-vehicle-title {
          display: flex;
          justify-content: space-between;
          span {
            display: inline-block;
          }
        }
        .off-site-call-vehicle-content {
          width: 100%;
          display: flex;
          justify-content: space-around;
          padding: 10px;
          margin-top: 10px;
          border-radius: 5px;
          background-color: #ccc;

          .vehicle-base-message {
            width: 60%;
            font-size: 12px;
            max-height: 30px;
            overflow: hidden;
          }

          .license-plate {
            display: inline-block;
            color: red;
            font-size: 16px;
            font-weight: 500;
          }
        }
      }
    }
  }
  // 底部
  .vehicle-statistic-footer {
    width: 100%;
    flex: 1;
    padding: 10px;
    margin-top: 15px;
    border: 1px solid #ccc;
    border-radius: 5px;
    max-height: 270px;
    box-sizing: border-box;
    // 车辆统计标题
    .vehicle-statistic-footer-title {
      display: flex;
      justify-content: space-between;
      align-items: center;

      // 车辆统计
      .vehicle-statistics {
        width: 30%;
        display: flex;

        .vehicle-statistics-font {
          display: inline-block;
          font-weight: 600;
          height: 100%;
        }

        .vehicle-statistics-btns { 
          margin-left: 15px;         
        }
      }
      // 导出按钮
      .vehicle-statistics-export {

      }
    }
    // 车辆统计数据
    .vehicle-statistics-data {
      margin-top: 10px;
    }
  }
}
